<!--
    group: 发票管理
    name: 发票列表-新开票
    url: /invoice/invoiceQueryNew
-->
<template>
  <div class="main_content">
    <div class="header_invioce">
      <h3>发票查询</h3>
      <a-button class="mLeft" v-has="'inq_inquern:click:sqkp'"  type="primary" @click="addInvioce">申请开票</a-button>
    </div>

    <a-tabs default-active-key="1" v-model="activeKey" @change="callback">
      <a-tab-pane v-for="item in astList" :key="item.key">
        <span slot="tab">{{ item.title }}</span>
        <InvoiceQueryItem v-if="activeKey == item.key" :key="timer" :businessStatus="item.id" :tabNum='item.tabNum' :goPageEvent="showtabs" :pageKey="item.key"/>
      </a-tab-pane>
    </a-tabs>

    <!--申请发票-->
    <a-modal
      :width="800"
      :footer="null"
      @cancel="cancleTicket"
      v-model="invoiceVisible"
    >
      <h4>请选择需要开票的企业</h4>
      <div class="table-page-search-wrapper" style="margin-bottom: 10px">
        <a-form layout="inline">
          <a-row :gutter="24" style="margin-top: 10px">
            <a-col :md="16" :lg="14" :xl="12" :xxl="10">
              <a-form-item label="企业名称">
                <a-input placeholder="请输入" v-model="filterList.entName" />
              </a-form-item>
            </a-col>
            <a-col :md="8">
              <span class="table-page-search-submitButtons">
                <a-button type="primary" icon="search" @click="handleSearch">搜索</a-button>
                <a-button style="margin-left: 10px" icon="reload" @click="handleReset">重置</a-button>
              </span>
            </a-col>
          </a-row>
        </a-form>
      </div>

      <a-table bordered
         :loading="loading"
         :pagination="false"
         :rowKey="row => row.id"
         :row-selection="{
            type: 'radio',
            selectedRowKeys: selectedRowKeys,
            onChange: onSelectChange
          }"
         :columns="columns"
         :data-source="tableData"
         :scroll="{x:700,y:300}"
      >
      </a-table>

      <div class="footer_invoice">
        <a-button @click="sure" class="btnsLarge" type="primary">确定</a-button>
      </div>
    </a-modal>

    <!--法人验证-->
    <EntMobileNumber
      v-if="legalVisibleStatus && entId"
      :visible="legalVisibleStatus"
      :entId="entId"
      @legalModalHidden="legalModalHidden"
    />

  </div>
</template>

<script>
import { getInvcCheck,getApplyList } from '@/api/invoiceAdminister'
import InvoiceQueryItem from './modules/invoiceQueryItem'
import EntMobileNumber from '@/views/common/entMobileNumber'
import status from '@/utils/invoicingStatus'
export default {
  name: 'invoiceQueryNew',
  components:{
    InvoiceQueryItem,
    EntMobileNumber
  },
  data(){
    return{
      astList: status.newInvoiceList,
      activeKey: status.newInvoiceList[0].key,
      timer:null,

      invoiceVisible: false,
      filterList: {},
      loading: false,  //表格加载
      tableData: [],
      columns: [
        {
          title: '企业名称',
          dataIndex: 'entName',
          width: 150,
          ellipsis: true,
          align: 'center'
        },
        {
          title: '统一社会信用代码',
          dataIndex: 'lisenceCreditCode',
          ellipsis: true,
          width: 150,
          align: 'center'
        },
        {
          title: '法人',
          dataIndex: 'legalName',
          ellipsis: true,
          width: 100,
          align: 'center'
        },
        {
          title: '法人手机号',
          dataIndex: 'legalPhone',
          ellipsis: true,
          width: 100,
          align: 'center'
        },
      ],
      selectedRowKeys: [],  //批量发布数据
      selectedRows: [],  //批量发布数据

      //法人验证
      legalVisibleStatus: false,
      entId: null,   //企业id
    }
  },
  // computed:{
  //   rowSelection() {
  //     const { selectedRowKeys } = this;
  //     return {
  //       selectedRowKeys, // 一定要加上这一行代码，清除才会有作用
  //       onChange: (selectedRowKeys, record) => {
  //         this.selectedRowKeys = selectedRowKeys;
  //       },
  //       getCheckboxProps: record => ({
  //         props: {
  //           // disabled: record.checkConfirmAuditStatus != 3 || record.uploadDeliverableFileStatus !=3
  //         },
  //       })
  //     }
  //   }
  // },
  mounted() {
    this.$route.query.pagetab && this.showtabs(this.$route.query.pagetab);//跳转到指定tab
    this.getTableData();
  },
  methods:{
    //法人验证关闭
    legalModalHidden(){
      this.legalVisibleStatus = false;
      this.invoiceVisible = true;
      this.handleReset();
    },
    //查询
    handleSearch(){
      this.getTableData();
    },
    //重置
    handleReset(){
      this.filterList = {};//清空查询条件
      this.selectedRowKeys = [];
      this.selectedRows = [];
      this.getTableData();//重置列表
    },
    //申请发票
    addInvioce(){
      this.invoiceVisible = true;
    },
    //
    onSelectChange (selectedRowKeys,selectedRows) {
      this.selectedRowKeys = selectedRowKeys;
      this.selectedRows = selectedRows;
    },
    //确定
    sure(){
      if(this.selectedRowKeys.length > 0){
        this.entId = this.selectedRowKeys[0];
        let verification = this.selectedRows[0].verification;  //法人三要素是否通过的核验标识,0-否1-是
        //判断企业法人是否进行实名验证
        if(verification == 1){
          //跳转页面携带企业id
          this.$router.push({
            path: '/invoice/applyInvoice',
            query:{
              bizId: this.entId
            }
          })
        }else{
          //法人验证弹层
          this.invoiceVisible = false;
          this.legalVisibleStatus = true;
        }
        //是否存在未完成的开票
        // getInvcCheck(id).then(res => {
        //   if (res.success) {
        //     //1是 2 否
        //     if (res.result == 1){
        //
        //     }else {
        //       this.$message.warning('该企业存在未完成的开票，无法继续开票');
        //     }
        //   }else{
        //     this.$message.warning(res.message);
        //   }
        // })
      }else{
        this.$message.warning('选择项不能为空');
      }
    },
    //取消
    cancleTicket(){
      this.invoiceVisible = false;
    },
    //首次获取表格数据
    getTableData(){
      this.loading = true;
      let params = {};
      params = this.filterList;
      params.opType = 1003;

      getApplyList(params).then(res => {
        if (res.success) {
          // 赋值表格数据
          this.tableData = res.result || [];
          this.loading = false;
        }else{
          this.$message.warning(res.message);
        }
      })
    },
    callback(key){
      this.timer = new Date().getTime();
    },
    showtabs(pageNum){
      // if (this.$route.query.pagetab){
      //   this.activeKey = this.$route.query.pagetab;
      // }
      this.activeKey =pageNum
    },
  }
}
</script>

<style scoped lang="less">
.main_content{
  color: @color-smudge;
}

h3,h4{
  font-weight: bolder;
}
h3{
  font-size: 20px;
}
h4{
  font-size: 18px;
  margin-bottom: 20px;
}

.header_invioce{
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}


.footer_invoice{
  width: 100%;
  margin-top: 30px;
  text-align: center;
}
</style>
